<template>
  <div class="bar">
    <div class="right">
      <t-button theme="primary" @click="form.open({})">
        <template #icon><t-icon name="add" /></template>
        {{ $t('common.create') }}
      </t-button>
    </div>
    <div class="title">{{ plugin.t('menu.pay') }}</div>
  </div>
  <div class="bg-box">
    <t-alert theme="info" :message="plugin.t('pay.alert')" style="margin-bottom: 20px" />
    <Table @update="data => form.open(data)" />
    <Form ref="form" />
  </div>
</template>
<script setup>
  import { ref } from 'vue'
  import app from '@/app'
  import index from '../../index'
  import Table from './table.vue'
  import Form from './form.vue'

  const plugin = index.plugin
  const form = ref(null)
</script>